﻿<Page
    x:Class="TemplatesExample.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TemplatesExample"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Page.Resources>
    <ControlTemplate x:Key="CustomButtonTemplate" TargetType="Button">
        <Grid>
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal" />
                    <VisualState x:Name="PointerOver">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border"
	                                Storyboard.TargetProperty="Background">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="DarkGreen" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
									Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPointerOverForegroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Pressed">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border"
									Storyboard.TargetProperty="Background">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPressedBackgroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
									Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonPressedForegroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border"
									Storyboard.TargetProperty="Background">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonDisabledBackgroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Border"
									Storyboard.TargetProperty="BorderBrush">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonDisabledBorderThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter"
									Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource ButtonDisabledForegroundThemeBrush}" />
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="FocusStates">
                    <VisualState x:Name="Focused">
                        <Storyboard>
                            <DoubleAnimation Storyboard.TargetName="FocusVisualWhite"
									Storyboard.TargetProperty="Opacity"
									To="1"
									Duration="0" />
                            <DoubleAnimation Storyboard.TargetName="FocusVisualBlack"
									Storyboard.TargetProperty="Opacity"
									To="1"
									Duration="0" />
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Unfocused" />
                    <VisualState x:Name="PointerFocused" />
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Border x:Name="Border"
					Background="DarkRed"
					BorderBrush="{TemplateBinding BorderBrush}"
					BorderThickness="{TemplateBinding BorderThickness}"
                    CornerRadius="15"
					Margin="3">
                <ContentPresenter x:Name="ContentPresenter"
						Content="{TemplateBinding Content}"
						ContentTransitions="{TemplateBinding ContentTransitions}"
						ContentTemplate="{TemplateBinding ContentTemplate}"
						Margin="{TemplateBinding Padding}"
						HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
						VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
            </Border>
            <Rectangle x:Name="FocusVisualWhite"
					IsHitTestVisible="False"
					Stroke="{StaticResource FocusVisualWhiteStrokeThemeBrush}"
					StrokeEndLineCap="Square"
					StrokeDashArray="1,1"
					Opacity="0"
					StrokeDashOffset="1.5" />
            <Rectangle x:Name="FocusVisualBlack"
					IsHitTestVisible="False"
					Stroke="{StaticResource FocusVisualBlackStrokeThemeBrush}"
					StrokeEndLineCap="Square"
					StrokeDashArray="1,1"
					Opacity="0"
					StrokeDashOffset="0.5" />
        </Grid>
    </ControlTemplate>
    </Page.Resources>

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
        <Grid.Resources>
            <Style x:Key="ButtonStyle" TargetType="Button">
                <Setter Property="HorizontalAlignment" Value="Center"></Setter>
                <Setter Property="VerticalAlignment" Value="Center"></Setter>
            </Style>
            <Style x:Key="MessageStyle" TargetType="TextBlock">
                <Setter Property="Margin" Value="5"></Setter>
            </Style>
            <local:MessageTypeConverter x:Key="MessageTypeConverter"/>
            <DataTemplate x:Key="MessageTemplate">
                <Grid HorizontalAlignment="Center" Width="250" Height="30" VerticalAlignment="Center"
			            Background="{Binding Type, Converter={StaticResource MessageTypeConverter}}">
                    <TextBlock Style="{StaticResource MessageStyle}" Text="{Binding Message}"></TextBlock>
                </Grid>
            </DataTemplate>
        </Grid.Resources>
        <Grid.DataContext>
            <local:ViewModel/>
        </Grid.DataContext>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>
        <Button Margin="5" 
				Content="Add Message" 
				Style="{StaticResource ButtonStyle}"
				Command="{Binding AddMessage}" Template="{StaticResource CustomButtonTemplate}">
        </Button>
        <ListView Grid.Row="1" 
			        ItemsSource="{Binding Messages}"
			        ItemTemplate="{StaticResource MessageTemplate}">
        </ListView>
    </Grid>
</Page>
